<!DOCTYPE html>
<html  xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"/>
    <title>Title</title>
    <link rel="stylesheet" th:href="@{/layui/layui.css}"  media="all" />
    <link rel="stylesheet" th:href="@{/css/index.css}" />
    <script type="text/javascript" th:src="@{/js/jquery-3.2.1.js}"></script>
    <script th:src="@{/layui/layui.all.js}"></script>
</head>
<body>
<!--轮播图片-->
<div class="layui-carousel" id="test1">
    <div carousel-item="">
        <div><img src="image/lun.jpg" width="100%" height="100%"/></div>
        <div><img src="image/lun2.jpg" width="100%" height="100%"/></div>
        <div><img src="image/13.jpg" width="100%" height="120%"/></div>
    </div>
</div>
<script>
    layui.use('carousel', function () {
        var carousel = layui.carousel;
        //建造实例
        carousel.render({
            elem: '#test1'
            , width: '100%' //设置容器宽度
            , arrow: 'none' //始终显示箭头
            , width: '1080px'
            , height: '150px'
            //,anim: 'updown' //切换动画方式
        });
    });
</script>

<fieldset class="layui-elem-field layui-field-title">
    <legend style="font-size: 14px">首页</legend>
</fieldset>
<div class="row">
    <div class="sysNotice col">

        <blockquote class="layui-elem-quote title">最新公告</blockquote>


        <div class="layui-elem-quote layui-quote-nm">
            <div class="tip"></div>
        </div>
    </div>
    <div class="sysNotice col">
        <blockquote class="layui-elem-quote title">本寝积分<a id="jfgz" style="position: relative;left: 340px">积分规则</a></blockquote>
        <div>
            <table class="layui-table">
                <colgroup>
                    <col width="150"/>
                    <col/>
                </colgroup>
                <tbody class="tip3">
                </tbody>
            </table>
        </div>
        <blockquote class="layui-elem-quote title">本寝卫生情况</blockquote>
        <div>
            <table class="layui-table">
                <colgroup>
                    <col width="150"/>
                    <col/>
                </colgroup>
                <tbody class="tip1">
                </tbody>
            </table>
        </div>
        <blockquote class="layui-elem-quote title">本寝违规情况<i class="iconfont icon-new1"></i></blockquote>
        <div>
            <table class="layui-table" >
                <colgroup>
                    <col/>
                    <col width="110"/>
                </colgroup>

                <tbody class="tip2">
                <tr>
                    <td>ddf</td>
                </tr>

                </tbody>

            </table>
        </div>
    </div>
</div>
<!--最新公告-->
<script>
    $(function () {
        $.get('text/index', function (data) {
            var htmls = []

            /*       console.log(data);*/

            /*$('#biaoti').val(date.title);*/

            var demo = '<div class="biaoti">' + data.title +'</div>'+
                '<div class="shijian">' + '时间:' + data.time +'</div>'+
                '<div>'+ data.context+ '</div>'


            htmls.push(demo)
            $('.tip').html(htmls.join(''))


        })
    })




    layui.use(['carousel', 'form'], function() {
        var carousel = layui.carousel
            , form = layui.form;
    })



</script>
<!--最新卫生-->
<script>

    $(function () {
        $.get('/dor/getRoomHea', function (data) {
            var htmls = []
            data.forEach(function (item, index) {
                var demo = '<tr><td>日期</td><td>'+ item.date +'</td><td>检查情况</td><td>' + item.rank  + '</td></tr>'
                htmls.push(demo)
            });

            $('.tip1').html(htmls.join(''))


        });
    })

    $(function () {
        $.get('/dor/getRoomRule', function (data) {
            var htmls = []
            data.forEach(function (item, index) {
                var demo = '<tr><td>日期</td><td>'+ item.date +'</td><td>详情</td><td>' + item.descript  + '</td></tr>'
                htmls.push(demo)
            });

            $('.tip2').html(htmls.join(''))


        });
    })

    $(function () {
        $.get('/dor/grjifen', function (data) {
            var htmls = []
            data.forEach(function (item, index) {
                var demo = '<tr><td>积分</td><td>'+ item.score +'</td></tr>'
                htmls.push(demo)
            });
           /* console.log(date.score)*/
            $('.tip3').html(htmls.join(''))


        });
    })

    //积分规则
    $("#jfgz").on('click', function () {
        layui.use('layer', function(){
            var layer = layui.layer;
            layer.open({
                title: '积分规则'
                ,content: '<sapn>根据寝室检查来加减积分</sapn>' +
                '<table class="layui-table"><tr><td>卫生</td><td>得分</td></tr>' +
                '<tr><td>优</td><td>+2</td></tr>' +
                '<tr><td>良</td><td>+1</td></tr>' +
                '<tr><td>中</td><td>+0</td></tr>' +
                '<tr><td>差</td><td>-1</td></tr>' +
                '<tr><td>违规</td><td>-2</td></tr>' +
                '<tr><td>差</td><td>-1</td></tr></table>'
                ,closeBtn: 0
                ,maxWidth: 400
            });

        });
    })

</script>
</body>
</html>



